<template>
	<view class="listBox">
		<view class="header">
			<!-- 固定头部 -->
			<view class="fixed">
				<view class="fixedBox">
					<view :class="planShow == 1 ? '' : 'plan'" @click="[planShow = 1,list = [],getlist(1,{pageIndex:1,pageSize:10})]">干预计划</view>
					<view :class="planShow == 2 ? '' : 'record'" @click="[planShow = 2,list = [],getlist(2,{pageIndex:1,pageSize:10,type:'all'})]">干预记录</view> 
				</view>
			</view>
		</view>
		
		<view class="mainContent" v-if="list && list.length > 0">
			<!-- 干预计划 -->
			<view class="planBox" v-show="planShow == 2">
				<view class="item" v-for="(item,index) in list" :key="index">
					<view class="top">
						<view class="left">
							<image src="../../../static/img/monitor/headPortraits.png"></image>
							<view>{{item.userName}}</view>
						</view>
						<view :class="['right',item.status == 1?'on':'']">
							<text>{{item.status == 1?'正常':'逾期'}}</text>
							<view>{{item.modifiedDate}}</view>
						</view>
					</view>
					
					<view class="content">
						<view class="contentItem">
							<view class="data">计划日期：<text>{{item.createdDate}}</text></view>
							<view class="part">主要内容：<text>{{item.content}}</text></view>
						</view>
						<view class="specificItem">
							<view>具体事项：</view>
							<view v-html="item.specificMatters"></view>
						</view>
					</view>
				</view>
			</view>
			
			<!-- 干预记录 -->
			<view class="recordBox" v-show="planShow == 1">
				<view class="implement" v-for="(item,index) in list" :key="index">
					<view class="upperPart">
						<image src="@/static/img/monitor/healthStatus/number@2x.png" class="identifier"></image>
						<text class="assementNumber">{{item.status == 1 ? '方案编号' : item.sn}}</text>
						<text :class="item.status == 1 ? 'dataTime1' : 'dataTime'">{{item.status == 1 ? '未存档' : item.modifiedDate}}</text>
					</view>
					<view class="lowerPart">
						<view class="nameBox">
							<text class="userName">{{item.realName}}</text>
							<image src="@/static/img/healthStatus/record.png" v-if="item.status != 4"></image>
							<text class="healthName"  v-if="item.status != 4">{{item.healthName}}</text>
						</view>
						<view class="buttonBox">	
							<view class="qsDetail" @click="detail(item)">详情</view>
						</view>
					</view>
				</view>
				
			</view>
		</view>
		<view class="noneChating" v-if="list && list.length <= 0">
			<image src="../../../static/img/index/chattingNone.png"></image>
			<view>暂无数据~</view>
		</view>
	</view>
</template>

<script src="@/static/js/monitor/interventionPlan/list.js"></script>

<style lang="scss" scoped>
	.noneChating {
		padding-top: 228upx;
		background: #fff;
		min-height: 81.5vh;
		width: 702upx;
		margin: -86upx auto 0;
		border-radius: 22upx;
		image {
			display: block;
			margin: 0 auto;
			width: 260upx;
			height: 154upx;
		}
		view {
			margin: 24px auto;
			text-align: center;
			color: #666666;
			font-size: 30upx;
		}
	}
	@import '@/static/css/monitor/interventionPlan/list.scss';
</style>
